/**
 * By Alpha
 * Author: alixez <alixe.z@foxmail.com>
 * Date: 2017/12/13
 */

import React from 'react';
import { Page } from 'components';
import { DepartmentsPane, JobPane, RolePane } from './components';
import { connect } from 'dva';
import { Tabs } from 'antd';
import PropTypes from 'prop-types';

const TabPane = Tabs.TabPane;

@connect(({ loading, organizationDepartment, organizationJob, organizationRole, app, user }) => ({ loading, organizationDepartment, organizationJob, organizationRole, app, user }))
class Department extends React.Component {
  static propTypes = {
    organizationRole: PropTypes.object,
    organizationDepartment: PropTypes.object,
    organizationJob: PropTypes.object,
    app: PropTypes.object,
    dispatch: PropTypes.func,
    user: PropTypes.object,
  }

  render () {
    const { organizationDepartment, organizationJob, organizationRole, app, dispatch, user } = this.props;
    const departmentPaneProps = {
      organizationDepartment,
      app,
      dispatch,
      organization: user.organization,
    };
    const jobPaneProps = {
      organizationJob,
      app,
      dispatch,
      organization: user.organization,
    };
    const rolePaneProps = {
      organizationRole,
      app,
      dispatch,
      organization: user.organization,
    };
    return (<Page inner>
      <Tabs defaultActiveKey="departments">
        <TabPane tab="组织架构" key="departments">

          <DepartmentsPane
            {...departmentPaneProps}
            // organization={app.user && app.user.currentOrganization}
            // department={organizationDepartment}
          />

        </TabPane>
        <TabPane tab="职位" key="jobs">
          <JobPane 
            {...jobPaneProps}
          />
        </TabPane>
        <TabPane tab="角色" key="roles">
          <RolePane 
            {...rolePaneProps}
          />
        </TabPane>
      </Tabs>
    </Page>);
  }
}

export default Department;
